<template>
    <div class="content-main">
        <div class="breadcrumb">
            <div class="breadcrumb-icon">
                <img src="./../../assets/images/breadcrumb_icon.png" />
            </div>
            <el-breadcrumb separator="/">
                <el-breadcrumb-item>报告评分设置</el-breadcrumb-item>
            </el-breadcrumb>
        </div>
        <div class="content-box">
            <div class="search-box">
                <div class="search-item">
                    <span class="search-title">班级名称: </span>
                    <el-select
                        v-model="classStatusValue"
                        placeholder="请选择班级"
                        value-key="value"
                        style="float:left;">
                        <el-option
                        v-for="item in classStatus"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value">
                        </el-option>
                    </el-select>
                </div>
                <div class="search-item">
                    <span class="search-title">报告名称: </span>
                    <!-- <el-select
                        v-model="reportValue"
                        placeholder="请选择报告名称"
                        value-key="value"
                        style="float:left;">
                        <el-option
                        v-for="item in reportStatus"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value">
                        </el-option>
                    </el-select> -->
                    <el-input type="text"
                        v-model="reportValue"
                        placeholder="请输入报告名称"
                        style="float:left; width:200px;"
                    ></el-input>
                </div>
                <div class="search-item">
                    <el-button type="primary" @click="searchFn">搜索</el-button>
                </div>
            </div>
            <div class="table-content" v-loading="tableLoading">
                <el-table
                :data="tableData"
                border
                style="width: 100%">
                    <el-table-column label="序号" width="100px">
                        <template slot-scope="scope"><span>{{scope.$index+(currentPage - 1) * pagesize + 1}}</span> </template>
                    </el-table-column>
                    <el-table-column  prop="className" label="班级">
                    </el-table-column>
                    <el-table-column  prop="reportName" label="报告名称">
                    </el-table-column>
                    <el-table-column label="操作">
                        <template slot-scope="scope">
                            <el-button type="text" size="small" @click="evaluationSet(scope.row.classId,scope.row.className, scope.row.reportName, scope.row.reportId, scope.row.reportScoreLevel)">评分设置</el-button>
                        </template>
                    </el-table-column>
                </el-table>
                <el-pagination
                    @size-change="handleSizeChange"
                    @current-change="handleCurrentChange"
                    :current-page="currentPage"
                    :page-size="pagesize"
                    layout="total, prev, pager, next, jumper"
                    :total="totalCount"
                    style="margin-top: 20px; text-align: center;">
                </el-pagination>
            </div>
            <el-dialog title="评分设置" :visible.sync="dialogFormVisible2" width="40%" @close="dialogClose">
                <el-form :model="form2" ref="dialogForm" :rules="rules2"  >
                    <el-form-item label="班级名称 :" style="margin-bottom:10px;">
                        <span>{{ form2.className }}</span>
                    </el-form-item>
                    <el-form-item label="报告名称 :" style="margin-bottom:10px;">
                        <span>{{ form2.reportName }}</span>
                    </el-form-item>
                    <el-form-item label="优">
                        <el-col :span="8">
                            <el-form-item prop="you1">
                                <el-input type="text" v-model="form2.you1" style="width: 100%;"></el-input>
                            </el-form-item>
                        </el-col>
                        <el-col class="line" :span="2" style="text-align:center;">-</el-col>
                        <el-col :span="8">
                            <el-form-item prop="you2">
                                <el-input type="text" v-model="form2.you2" style="width: 100%;"></el-input>
                            </el-form-item>
                        </el-col>
                        <el-col :span="2" style="text-align:center;">分</el-col>
                    </el-form-item>
                    <el-form-item label="良">
                        <el-col :span="8">
                            <el-form-item prop="liang1">
                                <el-input type="text" v-model="form2.liang1" style="width: 100%;"></el-input>
                            </el-form-item>
                        </el-col>
                        <el-col class="line" :span="2" style="text-align:center;">-</el-col>
                        <el-col :span="8">
                            <el-form-item prop="liang2">
                                <el-input type="text" v-model="form2.liang2" style="width: 100%;"></el-input>
                            </el-form-item>
                        </el-col>
                        <el-col :span="2" style="text-align:center;">分</el-col>
                    </el-form-item>
                    <el-form-item label="中">
                        <el-col :span="8">
                            <el-form-item prop="zhong1">
                                <el-input type="text" v-model="form2.zhong1" style="width: 100%;"></el-input>
                            </el-form-item>
                        </el-col>
                        <el-col class="line" :span="2" style="text-align:center;">-</el-col>
                        <el-col :span="8">
                            <el-form-item prop="zhong2">
                                <el-input type="text" v-model="form2.zhong2" style="width: 100%;"></el-input>
                            </el-form-item>
                        </el-col>
                        <el-col :span="2" style="text-align:center;">分</el-col>
                    </el-form-item>
                    <el-form-item label="差">
                        <el-col :span="8">
                            <el-form-item prop="cha1">
                                <el-input type="text" v-model="form2.cha1" style="width: 100%;"></el-input>
                            </el-form-item>
                        </el-col>
                        <el-col class="line" :span="2" style="text-align:center;">-</el-col>
                        <el-col :span="8">
                            <el-form-item prop="cha2">
                                <el-input type="text" v-model="form2.cha2" style="width: 100%;"></el-input>
                            </el-form-item>
                        </el-col>
                        <el-col :span="2" style="text-align:center;">分</el-col>
                    </el-form-item>
                </el-form>
                <div slot="footer" class="dialog-footer" style="text-align:center;">
                    <el-button type="primary" @click="submitForm2('form2')">保存</el-button>
                </div>
            </el-dialog>
        </div>
    </div>
</template>

<script>
    import BreadCrumbBack from '@/components/breadCrumbBack.vue'
    import { validateNumber } from "./../../api/validate.js";
    const isvalidateNumber = (rule, value, callback) => {
        if(value != null && value != "") {
            if(!validateNumber(value)) {
                callback(new Error('请输入正确格式'))
            } else {
                callback()
            }
        }
        else{
            callback();
        }
    }
    export default {
        components: {
            BreadCrumbBack
        },
        data () {
            return {
                classId: '',
                projectId: '',
                classStatus: [
                    {
                        value: '',
                        label: '全部'
                    }
                ],
                classStatusValue: '',
                reportStatus: [
                    {
                        value: '',
                        label: '全部'
                    }
                ],
                reportValue: '',
                tableLoading: false,
                tableData: [],
                currentPage: 1,
                pagesize: 10,
                totalCount: 1000,
                dialogFormVisible2: false,
                formLabelWidth: '20px',
                form2: {
                    className: '',
                    reportName: '',
                    you1: '',
                    you2: '',
                    liang1: '',
                    liang2: '',
                    zhong1: '',
                    zhong2: '',
                    cha1: '',
                    cha2: ''
                },
                rules2: {
                    you1: [
						{ required: true, message: '请输入评分', trigger: 'blur' },
						{ required: true, validator: isvalidateNumber, trigger: 'blur' }
                    ],
                    you2: [
						{ required: true, message: '请输入评分', trigger: 'blur' },
						{ required: true, validator: isvalidateNumber, trigger: 'blur' }
                    ],
                    liang1: [
                        { required: true, message: '请输入评分', trigger: 'blur' },
						{ required: true, validator: isvalidateNumber, trigger: 'blur' }
                    ],
                    liang2: [
                        { required: true, message: '请输入评分', trigger: 'blur' },
						{ required: true, validator: isvalidateNumber, trigger: 'blur' }
                    ],
                    zhong1: [
                        { required: true, message: '请输入评分', trigger: 'blur' },
						{ required: true, validator: isvalidateNumber, trigger: 'blur' }
                    ],
                    zhong2: [
                        { required: true, message: '请输入评分', trigger: 'blur' },
						{ required: true, validator: isvalidateNumber, trigger: 'blur' }
                    ],
                    cha1: [
                        { required: true, message: '请输入评分', trigger: 'blur' },
						{ required: true, validator: isvalidateNumber, trigger: 'blur' }
                    ],
                    cha2: [
                        { required: true, message: '请输入评分', trigger: 'blur' },
						{ required: true, validator: isvalidateNumber, trigger: 'blur' }
                    ]
                }
            }
        },
        created () {
            this.init()
            this.initTbale()
        },
        methods: {
            init(){
                let self = this
                self.$http.get('/dataplatform/common/search/listClassItem').then(response => {
                    let res = response.data
                    if(res.code == '200'){
                        for (let i = 0; i < res.data.classList.length; i++) {
                            let classJson = {}
                            classJson.label = res.data.classList[i].name
                            classJson.value = res.data.classList[i].id
                            self.classStatus.push(classJson)
                        }
                    }else if(res.code == '401'){
                        self.$router.replace({
                            path:'/login'
                        })
                    }else{
                        self.$message.error(res.message)
                    }
                })
                self.$http.post('/dataplatform/basis/functions/report/t/getTeacherClassReportListForSearch').then(response => {
                    let res = response.data
                    if(res.code == '200'){
                        for (let i = 0; i < res.data.length; i++) {
                            let reportJson = {}
                            reportJson.label = res.data[i].reportName
                            reportJson.value = res.data[i].id
                            self.reportStatus.push(reportJson)
                        }
                    }else if(res.code == '401'){
                        self.$router.replace({
                            path:'/login'
                        })
                    }else{
                        self.$message.error(res.message)
                    }
                })
            },
            initTbale(){
                let self = this
                self.$http.get('/dataplatform/basis/func/param/teacherReportScoreLevelSetUpList?pageNum='+self.currentPage+'&pageSize='+self.pagesize+'&reportName='+self.reportValue+'&classId='+self.classStatusValue).then(response => {
                    let res = response.data
                    if(res.code == '200'){
                        self.tableData = res.data.list
                        self.totalCount = res.data.total
                    }else if(res.code == '401'){
                        self.$router.replace({
                            path:'/login'
                        })
                    }else{
                        self.$message.error(res.message)
                    }
                })
            },
            //表格分页
			handleSizeChange: function (size) {
				this.pagesize = size;
			},
			handleCurrentChange: function(currentPage) {
                this.currentPage = currentPage
                this.initTbale()
            },
            //评价设置
            evaluationSet(classId, className, reportName, projectId, reportScoreLevel) {

                this.dialogFormVisible2 = true
                this.classId = classId
                this.projectId = projectId
                this.form2.className = className
                this.form2.reportName = reportName
                this.form2.you1 = ''
                this.form2.you2 = ''
                this.form2.liang1 = ''
                this.form2.liang2 =''
                this.form2.zhong1 = ''
                this.form2.zhong2 = ''
                this.form2.cha1 = ''
                this.form2.cha2 = ''
                if(reportScoreLevel == null) return
                this.form2.you1 = reportScoreLevel.excellentUp
                this.form2.you2 = reportScoreLevel.excellentDown
                this.form2.liang1 = reportScoreLevel.goodUp
                this.form2.liang2 = reportScoreLevel.goodDown
                this.form2.zhong1 = reportScoreLevel.middleUp
                this.form2.zhong2 = reportScoreLevel.middleDown
                this.form2.cha2 = reportScoreLevel.badDown == 0 ? '0' : reportScoreLevel.badDown
                this.form2.cha1 = reportScoreLevel.badUp
            },
            dialogClose(){
                this.$refs.dialogForm.resetFields()
            },
            //评价设置表单提交
            submitForm2(formName) {
                let self = this
				self.$refs.dialogForm.validate((valid) => {
                    if (valid) {
                        if(parseFloat(self.form2.you2) > parseFloat(self.form2.you1)){
                            self.$message.error('优秀下限必须小于优秀上限')
                            return
                        }
                        if(parseFloat(self.form2.liang1) != parseFloat(self.form2.you2)){
                            self.$message.error('优秀下限必须与良好上限相等')
                            return
                        }
                        if(parseFloat(self.form2.liang2) > parseFloat(self.form2.liang1)){
                            self.$message.error('良好上限必须大于良好下线')
                            return
                        }
                        if(parseFloat(self.form2.zhong1) != parseFloat(self.form2.liang2)){
                            self.$message.error('良好下限必须与中等上限相等')
                            return
                        }
                        if(parseFloat(self.form2.zhong2) > parseFloat(self.form2.zhong1)){
                            self.$message.error('中等上限必须大于中等下限')
                            return
                        }
                        if(parseFloat(self.form2.cha1) != parseFloat(self.form2.zhong2)){
                            self.$message.error('中等下限必须与差上限相等')
                            return
                        }
                        if(parseFloat(self.form2.cha2) > parseFloat(self.form2.cha1)){
                            self.$message.error('差上限必须大于差下限')
                            return
                        }
                        self.$http.post('/dataplatform/basis/func/param/saveGradeLevel',{
                            userId: null,
                            classId: self.classId,
                            reportId: self.projectId,
                            excellentUp: self.form2.you1,
                            excellentDown: self.form2.you2,
                            goodUp: self.form2.liang1,
                            goodDown: self.form2.liang2,
                            middleUp: self.form2.zhong1,
                            middleDown: self.form2.zhong2,
                            badUp: self.form2.cha1,
                            badDown: self.form2.cha2
                        }).then(response => {
                            let res = response.data
                            if(res.code == '200'){
                                self.$message({
                                    message: '评分设置成功',
                                    type: 'success'
                                })
                                self.initTbale()
                                self.$refs[formName].resetFields()
                                self.dialogFormVisible2 = false
                            }else if(res.code == '401'){
                                self.$router.replace({
                                    path:'/login'
                                })
                            }else{
                                self.$message.error(res.message)
                            }
                        })
                    }
                })
            },
            //搜索
            searchFn() {
                this.currentPage = 1
                this.initTbale()
            }
        }
    }
</script>
